<template>
    <div @onChange='change' >
        <slot ></slot>
        <slot name='list'></slot>
    </div>
</template>
<script>
export default {
    name:'sortGroup',
    mounted(){
        this.$slots.default.forEach((v,i)=>{
            if(v.componentOptions.tag === 'sortTag'){
                v.componentInstance.$on('on-change',(k,v)=>{
                    this.group(k,v);
                    this.change(k,v,i);
                })
            }
        })
    },
    data(){
        return {
            groups:[]
        }
    },
    methods:{
        group(key,value){
            this.groups = this.groups.filter(i=>i['key']!==key);
            this.groups.push({key,value});
            this.$emit('input',this.groups);
        },
        change(k,v,i){
            this.$emit('change',k,v,i);
        }
    }
}
</script>

